<template>
  <div class="common-warp wh100 warp-bg">
    <div class="noo">
      <a-card title="所有功能">
        <!-- <a-checkbox-group v-model:value="state.value1" :options="state.optionsWithDisabled">
          <template #label="{ value, label }">
            <div style="display: flex;justify-content: center;"><img class="img"
                src="https://www.cqzkteco.com/static/default_tenant/53a8b10a9ffe4c07b4aa711850537ae3.png"></div>
            <div>{{ label }}</div>
          </template>
</a-checkbox-group> -->

<div style="width: 100%;height:400px">        <easy-player ref="player" id="player1" :video-url="'http://192.168.0.49:8999/live/movie.flv'"
          :isresolution="'fhd'" :muted="true" :video-title="'重庆'" show-custom-button style="width: 100%;height: 100%"
          :autoplay="true" /></div>



      </a-card>
    </div>
    <a-button type="primary" block @click="confirm(formaRef)">提交</a-button>
  </div>
</template>

<script lang='ts' setup>
import { ref, reactive, onMounted, } from 'vue';
import { useRouter } from 'vue-router'

const router = useRouter()
const formaRef = ref();

const useContenta = () => {
  return {
    code: "",
    name: "",
  }
}
const useContentb = () => {
  return {
    organizationCode: "",
    positionCode: "",
    privilege: 0,
  }
}
const useContentc = () => {
  return {
    avatarUrl: "",
    bioPhotoUrl: "",
  }
}

const state = reactive({
  forma: useContenta(),
  formb: useContentb(),
  formc: useContentc(),
  optionsWithDisabled: [
    { label: '门禁区域', value: '1' },
    { label: '门禁区域', value: '2' },
    { label: '门禁区域', value: '3' },
  ],
  value1: undefined
})



//提交
const confirm = (formRef: any) => {
  console.log('formRef', state.value1)
  if (!formRef) return;
  formRef.validate().then(async () => {
    console.log('formRef', state.value1)
  })
};

onMounted(() => {
  document.title = '新增'
})

</script>
<style scoped lang='less'>
.noo {
  height: calc(100vh - 56px);
  overflow-y: scroll;

  .img {
    width: 30px;
    height: 30px;
  }

  :deep(.ant-checkbox-group) {
    width: 100%;
    justify-content: space-between;
  }
}
</style>